<!-- 成交结算 -->
<template>
	<div>
	    <el-form :inline="true" :model="ruleForm" class="demo-form-inline">
	    	<el-form-item label="报表名称：">
				<el-input placeholder="请输入报表名称" v-model.trim="ruleForm.reportName" maxlength="20" size="small"></el-input>
	    	</el-form-item>

	    	<el-form-item>
	    		<el-button type="success"  @click="searchList" id="monitorEnter" size="small">查询</el-button>
        		<el-button type="primary"  @click="generateReport" size="small">生成报表</el-button>
	    	</el-form-item>
	    </el-form>

		<el-table :data="tableData" border style="width: 70%">
			<el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
			<el-table-column label="报表名称" prop="name" align="center"></el-table-column>
			<el-table-column label="月份" prop="month" align="center"></el-table-column>
			<el-table-column label="成交结算金额（元)"  prop="amount" :formatter="initCash" align="center"></el-table-column>
			<el-table-column label="成交详情" align="center">
				<template slot-scope="scope">
					<el-button type="text" @click="seehander(scope.row)">查看</el-button>
				</template>
			</el-table-column>
		</el-table>

		<div class="pagebar">
		  <el-pagination
		    background
		    layout="total, sizes, prev, pager, next"
		    :current-page.sync="ruleForm.pageNum"
		    :page-sizes="[10, 20, 30, 40]"
		    :page-size="ruleForm.pageSize"
		    @size-change="handleSizeChange"
		    @current-change="handleCurrentChange"
		    :total="totalSize">
		  </el-pagination>
		</div>

	</div>
</template>
<script>
    import api from '@/api/apiPath'
	export default {
		name: 'transactionSettle',
		title:'成交结算',
		data () {
			return {
				ruleForm:{
					reportName:undefined,
					pageNum: 0,
					pageSize: 10,
				},
				totalSize:0,
				tableData:[],

			}
		},

		methods:{
			initCash(row, column, cellValue, index){
			    if(cellValue !== 0){
			        return cellValue.toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g,",");
			    }
			    if(cellValue == 0){
			        return "0.00"
			    }
			},
			handleCurrentChange(){
				this.getlist()
			},
			handleSizeChange(val){
				this.ruleForm.pageSize = val
				this.getlist();
			},
			getlist(){
				this.axios.post(api.DEALLIST,this.ruleForm).then((res) => {
					if (res.data.code == 200) {
						this.tableData = res.data.data.list;
						this.totalSize = res.data.data.total;
					}
				})
			},
			generateReport(){
				this.$router.push({path:'/transactionSettleReport'})
			},
			searchList(){
				this.ruleForm.pageNum = 1
				this.getlist()
			},
			seehander(row){
				this.$router.push({path:'/transactionSettle2',query:{tdata:row.month}})
			}
		},
		activated(){
           this.searchList()
        },
		created(){
			this.getlist()
		}
	}
	

</script>


<style lang="stylus" scoped>
</style>